<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        div{
        width:100px;
        height:100px;
        /* 外边距     */
        /* 一个值时是上下左右都为10px  */ 
        /* margin:10px 20px; */
        /* 两个值时上下为10px，左右为20px */
        /* margin: 10px 20px; */
        /* 上外边距为10px,左右为20px，下外边距为30px */
        /* margin: 10px 20px 30px; */
        /* 上右下左外边距为10px 20px 30px 40px */
        margin: 10px 20px 30px 40px;
        /* 内边距 */
        padding:10px;
        /* 边框 width style color */
        border:1px solid red;
        border-top-width: 5px;
        border-top-style: dashed;
        border-top-color: violet;
    }
    </style>
</head>
<body>
    <div>块级元素</div>
</body>
</html>